import type { Component, App } from 'vue'

/* 全局组件引入 */
import osButton from './os-button/index.vue'
import osCharts from './os-charts/index.vue'
// import osDialog from './el-dialog/index.vue'
import osTabs from './os-tabs/index.vue'
// import osChartsCard from './os-charts-card/index.vue'

/* 引入使用外部插件 */
// import OsPageTransition from './os-page-transition/index.vue'
import { vuePlugin } from 'highlight.js'


/* 全局挂载对象方法引入 */
import Http from '@/utils/http'

/* element-plus 组件按需全局注册 */
// import { ElRow, ElCol, ElSelect, ElInput, ElOption, ElContainer, ElTooltip, ElDialog } from 'element-plus'
/* 引入中文语言（它默认是英文） */
import ElementPlus from 'element-plus'
import 'dayjs/locale/zh-cn'
import locale from 'element-plus/lib/locale/lang/zh-cn'

/* 全局样式引入 */
import '@/assets/styles/index.scss'
// element-plus/packages/theme-chalk/src/index.scss
import 'element-plus/packages/theme-chalk/src/index.scss'
// import 'vue3-highlightjs/styles/atelier-heath-dark.css'
// import 'highlight.js/scss/atelier-heath-dark.scss'
import 'highlight.js/scss/atom-one-dark.scss'


/**
 * 组装所需全局公共组件注册
 */
const components: Component = {
  // 'os-page-transition': OsPageTransition,
  'os-button': osButton,
  'os-charts': osCharts,
  'os-tabs': osTabs,
  // 'os-charts-card': osChartsCard,
}
/**
 * 组装所需全局挂载对象方法
 */
const globalProperties: any = {
  '$http': Http
}

/* 外部插件 */
const externalPlugins: any = [
  // VueHighlightJS
]

const detalutElementPlusSet = {
  size: 'medium', // 所有拥有 size 属性的组件的默认尺寸均为 'medium'
  zIndex: 3000, // 弹框的初始 z-index 为 3000
  locale // 默认设置语言为中文
}

/**
 * 全局安装
 * @param app 
 */
const install = (app: App): void => {
  app.use(ElementPlus, detalutElementPlusSet)
  // 循环组装公共全局组件
  Object.keys(components).forEach(el => {
    app.component(el, components[el])
  })
  // 循环挂载全局对象方法
  Object.keys(globalProperties).forEach(el => {
    app.config.globalProperties[el] = globalProperties[el]
  })
  // 循环插件
  externalPlugins.forEach((plugin: any) => {
    app.use(plugin)
  })
  app.use(vuePlugin)
}
export default install